<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Send_Test</title>
	<script src="/static/jquery.min.js"></script>
</head>
<body>
	<input type="text" id="msg"><button onclick="javascript:sendmessage();">发送</button>
	<div><ul id="msgbox"></ul></div>
</body>
<script language="javascript">
	function sendmessage() {
		var msg = document.getElementById('msg').value;//取得要发送的信息内容
			//msg=msg.split(","); //字符分割为数组
		ws = new WebSocket("ws://lt.com:2346");
		ws.onopen = function() {
		    ws.send(msg);//向服务器发送一个字符串tom
		};
		ws.onmessage = function(e) {
			var ul = document.getElementById('msgbox');//找到消息列表盒子
			var len = ul.childElementCount;//已有的消息数
			var li = document.createElement("li");//创建DOM元素
			if (len>0)
			{
				ul.insertBefore(li,ul.firstElementChild);//在ul的第一个li之前插入
			}else{
				ul.appendChild(li);//直接插入
			}
			console.log(e.data);
			li.innerHTML = e.data;//服务器返回的消息
			li.id = "msg_" + ul.childElementCount;//消息的顺序号
		    //alert(e.data);//显示服务器返回的消息
		    //console.log(ul);
		};
	}
</script>
</html>